.wAuto {
  width: 100% !important;
  overflow: hidden;
}
.full {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.fullNone {
  position: absolute;
  top: 0;
  filter: alpha(opacity=0);
  opacity: 0;
  pointer-events: none;
  z-index: -1;
}
// 内外边距 ********************************************
// 类型
$spacing-types: (
  m: margin,
  p: padding,
);
// 位置
$spacing-directions: (
  t: top,
  b: bottom,
  l: left,
  r: right,
);
$spacing-base-size: 1px; // 基数
// 边框
@each $directionsKey, $directions in $spacing-directions {
  // border-t
  .border-#{$directionsKey} {
    border-#{$directions}: 1px #{$border} solid;
  }
  .border-#{$directionsKey}-list {
    > * {
      @if $directionsKey == 't' or $directionsKey == 'l' {
        &:not(:first-child) {
          border-#{$directions}: 1px #{$border} solid;
        }
      } @else {
        &:not(:last-child) {
          border-#{$directions}: 1px #{$border} solid;
        }
      }
    }
  }
}
@for $i from 0 through 1000 {
  .w#{$i} {
    width: $i * $spacing-base-size !important;
  }
  // 类型
  @each $typeKey, $type in $spacing-types {
    // m-10
    .#{$typeKey}-#{$i} {
      #{$type}: $i * $spacing-base-size !important;
    }
    // m-x-10
    .#{$typeKey}-x-#{$i} {
      #{$type}-left: $i * $spacing-base-size !important;
      #{$type}-right: $i * $spacing-base-size !important;
    }
    // m-y-10
    .#{$typeKey}-y-#{$i} {
      #{$type}-top: $i * $spacing-base-size !important;
      #{$type}-bottom: $i * $spacing-base-size !important;
    }
    // m-t-10
    @each $directionsKey, $directions in $spacing-directions {
      .#{$typeKey}-#{$directionsKey}-#{$i} {
        #{$type}-#{$directions}: $i * $spacing-base-size !important;
      }
    }
    @for $m from 0 through 50 {
      // m-10-10
      .#{$typeKey}-#{$i}-#{$m} {
        #{$type}: $i * $spacing-base-size $m * $spacing-base-size !important;
      }
    }
  }

  .radius-#{$i} {
    border-radius: $i * $spacing-base-size !important;
    overflow: hidden;
  }
  // 列表间距
  @each $directionsKey, $directions in $spacing-directions {
    //list-t-10
    .list-#{$directionsKey}-#{$i} {
      > * {
        @if $directionsKey == 't' or $directionsKey == 'l' {
          &:not(:first-child) {
            margin-#{$directions}: $i * $spacing-base-size !important;
          }
        } @else {
          &:not(:last-child) {
            margin-#{$directions}: $i * $spacing-base-size !important;
          }
        }
      }
    }
  }
  // 文字大小
  @if ($i > 10 and $i < 50) {
    .f-#{$i} {
      font-size: $i * $spacing-base-size !important;
    }
  }
  // 文字大小
  @if ($i < 500) {
    .dlText-#{$i} {
      dl {
        display: flex;
        line-height: 20px;
        dt {
          width: $i * $spacing-base-size !important;
          color: $info;
        }
        dd {
          flex: 1;
          overflow: hidden;
        }
      }
    }
  }
  // 文本溢出省略号
  @if ($i < 10) {
    .text-overflow-#{$i} {
      display: -webkit-box; /* 使用旧版WebKit内核布局盒模型 */
      -webkit-line-clamp: #{$i}; /* 限制文本显示的行数为2行 */
      -webkit-box-orient: vertical; /* 设置盒模型布局方向为垂直 */
      overflow: hidden; /* 超出部分隐藏 */
      text-overflow: ellipsis; /* 使用省略号表示被截断的部分 */
      // &:hover {
      //   white-space: normal; /* 显示全部 */
      //   overflow: visible; /* 取消超出隐藏 */
      // }
    }
  }
}
